window.addEventListener('load', function() {

    // 滚动事件：当页面被卷去到tap离上沿的距离时，变成绝对定位，否则无定位
    var tap = document.querySelector('.tap') // 获取tap元素
    var taptop = tap.offsetTop; // 获取距离上方的距离
    document.addEventListener('scroll', function(e) {
        if (window.pageYOffset >= taptop) {
            tap.style.position = 'fixed';
            tap.style.top = '0px';
            tap.style.zIndex = '2';
        } else {
            tap.style.position = 'static';
        }
    })

    // 节流阀变量 点击之后马上为false（为了防止跳转动画和滚动事件混合），先要等动画跳转完再打开（动画结束再变为true），滚动事件里面要添加if判断。
    var flag = true;

    // 点击事件：当鼠标点击某个tap菜单时，出现下划线.
    $('.tap a').click(function() {
        $('.xx1').removeClass('xx1');
        $('.tap a').css('border-bottom', '');
        $(this).css('border-bottom', '2px solid #0052d9');
    });

    // 点击媒体事件某项有背景颜色变白以及下面具体的项目切换
    $('.media-body ul').eq(0).siblings('ul').hide();
    $('.media-box1-1 li').on({
        click: function() {
            var index = $(this).index(); // 获取索引号
            $(this).css({
                backgroundColor: '#ffffff',
                borderTop: ' 4px solid #0052d9'
            }).siblings('li').css({
                borderTop: ' 4px solid  transparent',
                backgroundColor: '#fbfbfb'
            });
            $('.media-body ul').eq(index).show().siblings('ul').hide();
        }

    })

    // 轮播图
    var swiper = new Swiper('.swiper-container', {
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: {
            delay: 2000,
            disableOnInteraction: true,
        },
        pagination: {
            el: '.swiper-pagination',
            clickable: true,
        },
        navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev',
        },
    });

    //鼠标经过显示左边框 鼠标离开消失左边框
    $('.news1-2,.news1-3').on({
            mouseover: function() {
                $(this).css({
                    borderLeftColor: 'blue'
                })
            },
            mouseout: function() {
                $(this).css({
                    borderLeftColor: 'transparent'
                })
            }
        })
        // var flag = true
        // 鼠标点击某个项目时 让页面滑动到具体内容区域
    $('.tz').click(function() {
        flag = false // 节流阀
        var index = $(this).index() // 获取对应索引号

        jl = $('.mdd').eq(index).offset().top; // 获取对应模块距离文档上方的距离


        $("body, html").stop().animate({ // 将页面滚动到对应的位置
            scrollTop: jl
        }, function() {
            flag = true;
        })

    });

    // 企业动态距离文档上方的距离
    var qyTop = parseInt($('.dynamic').offset().top);
    $(window).scroll(function() {
        if ($(document).scrollTop() >= qyTop) { // 当页面滑动到企业动态电梯导航显示
            $('.elevator').fadeIn();
        } else {
            $('.elevator').fadeOut();
        }

        //    方法一
        // var documTop = $(document).scrollTop(); //页面滚动时 对应的上方a下划线显示
        // if (documTop <= $('.mdd').eq(1).offset().top) {
        //     $('.tap a').css('border-bottom', '2px solid transparent')
        //     $('.xx1').css('border-bottom', '2px solid #0052d9');
        // } else if (documTop <= $('.mdd').eq(2).offset().top) {
        //     $('.tap a').css('border-bottom', '2px solid transparent')
        //     $('#tz2').css('border-bottom', '2px solid #0052d9');
        // } else if (documTop <= $('.mdd').eq(3).offset().top) {
        //     $('.tap a').css('border-bottom', '2px solid transparent')
        //     $('#tz3').css('border-bottom', '2px solid #0052d9');
        // } else if (documTop <= $('.mdd').eq(4).offset().top) {
        //     $('.tap a').css('border-bottom', '2px solid transparent')
        //     $('#tz4').css('border-bottom', '2px solid #0052d9');
        // }

        // 方法二
        if (flag) { // 节流阀  点击按钮动画结束完才会执行这个
            $('.mdd').each(function(i, domm) {
                if ($(document).scrollTop() > $(domm).offset().top - 5) {
                    $('.tap a').css('border-bottom', '2px solid transparent') // 清除其他元素样式 
                    $('.tz a').eq(i).css({
                        borderBottom: '2px solid #0052d9'
                    })
                }
            })
        }


    });

    $('.elevator').click(function() { // 返回顶部
        $('body,html').stop().animate({
            scrollTop: 0
        })
    });


})